<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>节点笔记</title>
</head>
<body>
<ul>
  <li>
    <a href="笔记/banma.html">斑马线笔记</a>
    <a href="笔记/change.html">选项卡笔记</a>
    <a href="笔记/select.html">选项卡正反取消笔记</a>
    <a href="笔记/lunbotu.html">轮播图笔记</a>
    <a href="homework/1.html">变大变小的div</a>
    <a href="homework/2.html">向左移动的div</a>
    <a href="homework/3.html">逐渐变白的div</a>
    <a href="homework/banmaxian.html">斑马线作业</a>
    <a href="homework/bs表单/index.html">bs表单作业</a>
    <a href="homework/mall/label.html">蜜蜂选项卡作业</a>
    <a href="homework/伊森/index.html">轮播图作业</a>
    <a href="homework/蜜蜂/index.html">轮播图作业</a>

  </li>
</ul>

   <ul>
   	<li class="top"><a href="">time</a></li>
   	<li class="ab"><a href="" class="aa">time</a></li>
   	<li class="bottom"><a href="">time</a></li>
   	<li><a href="">time</a></li>
   </ul>
   <p class="p1" data="jd-001-xiezi">下午好<a>广州</a></p>

    <ul class="lo">
   	<li>tins</li>
   	<li>tins</li>
   	<li>tins</li>
   	<li>tins</li>
   </ul>

	<script>
    var nodes = document.childNodes;
    console.log(nodes);
    var html = document.childNodes[1];
    console.log(html);

    var head = html.firstChild;
    console.log(head);  //head

    var body = html.lastChild;
    console.log(body);	//body
   //获取父元素
    var a1 = document.querySelector('.aa'); /* querySelector*/
    var a2 = a1.parentNode;
    console.log(a2);                 //parentNode
    //aa的上一个父元素
    var a3 = a2.nextSibling.nextSibling;
    console.log(a3);
    //aa的下一个父元素
    var a4 = a2.previousSibling.previousSibling;
    console.log(a4);
    //元素信息
    var p = document.querySelector('.p1');
    console.log(p);
    console.log(p.nodeName);
    console.log(p.nodeType);
    console.log(p.nodeValue); //null
     //属性节点
    var pAttr = p.getAttributeNode('class')
			// 获取属性节点信息
			console.log(pAttr.nodeName)
			console.log(pAttr.nodeType)
			console.log(pAttr.nodeValue)
			// 3. 文本节点
    var a5 = p.childNodes[0];
    //获取文本节点信息
    console.log(a5.nodeName);
    console.log(a5.nodeType);
    console.log(a5.nodeValue);

    // 获取元素属性
    	var productId = p.getAttribute('data')
			console.log(productId)
			// 设置元素属性
    var productId = p.getAttribute('dadta', productId + '-test');
    //html
    var pHtml = p.innerHTML;
    console.log(pHtml);
    p.innerHTML = '晚上好，<a>广州塔</a>';
    var pText = p.textContent;
    console.log(pText);
    p.textContent = '早上好，广州';
    	</script>
</body>
</html>